<template>
  <div class="flex flex-col h-full">
    <SearchContainer @search="queryList" @reset="() => formRef.resetFields()">
      <a-form ref="formRef" class="form-style-flex" :model="formState">
        <a-form-item name="stdate" label="选择仓库" class="w-[300px]">
          <SelectWarehouse v-model:value="formState.xzck" placeholder="请选择" />
        </a-form-item>
        <a-form-item name="stdate" label="药理分类" class="w-[300px] ml-3">
          <a-select v-model:value="formState.ylfl" placeholder="请选择" />
        </a-form-item>
        <a-form-item name="pyjm" label="关键字" class="w-[300px] ml-3">
          <a-input v-model:value="formState.pyjm" placeholder="编号/名称/助记码" />
        </a-form-item>
        <a-form-item name="radio" class="ml-3">
          <a-radio-group v-model:value="formState.radioItem">
            <a-radio value="1">按品名汇总</a-radio>
            <a-radio value="2">按效期汇总</a-radio>
            <a-radio value="3">是否显示库存为0</a-radio>
          </a-radio-group>
        </a-form-item>
      </a-form>
    </SearchContainer>
    <a-card class="mt-2 flex-1">
      <!-- <div class="mb-3">
        <BaseExport type="药库" name="库存查询" code="00001005" :search-params="formState">导出</BaseExport>
      </div> -->

      <BaseTable :loading="loading" column-code="00001005" :data-source="tableData" bordered fill>
        <template #bodyCell="{ column, record, index }">
          <template v-if="column.dataIndex === 'xh'">
            <div>{{ index + 1 }}</div>
          </template>
          <template v-if="column.dataIndex === 'ypmc'">
            <MedicineInfo :value="{ mc: record.ypmc, gg: record.gg, cj: record.cj }" />
          </template>
          <template v-if="column.dataIndex === 'action'">
            <a-button type="primary" ghost size="small" @click="onHandleEdit(record)"> 出入库明细 </a-button>
          </template>
        </template>
      </BaseTable>
    </a-card>
    <Edit v-model:open="editOpen" :row-data="rowData" @success="onSuceess" />
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import SearchContainer from '@/components/SearchContainer'
// import { post } from '@/utils/request'
import BaseTable from '@/components/BaseTable'
import SelectWarehouse from '@/components/SelectWarehouse'
import Edit from './Edit'

// import { message } from 'ant-design-vue'
// import downloadCSV from '@/utils/tools/downloadCSV'
const rowData = ref(null)
const editOpen = ref(false)
const loading = ref(false)
const tableData = ref([
  {
    ckName: '测试仓库',
    hwh: '10086',
    ypbh: '1008610086',
    ypmc: '红花油',
    gg: '1瓶',
    kcsl: '100瓶',
    ph: '10086',
    yxq: '100年',
    dw: '瓶',
    ylfl: '外用'
  }
])
const formRef = ref(null)
const formState = ref({
  xzck: '',
  ylfl: null,
  radioItem: '',
  pyjm: ''
})
const onHandleEdit = (row) => {
  rowData.value = row
  editOpen.value = true
}
const queryList = async () => {
  // loading.value = true
  // // formState.value
  // const { code, data } = await post('/outp/mzdj/getOutpRecordInfoList', {
  //   brGzdw: formState.value.brGzdw,
  //   brId: '',
  //   brSfz: formState.value.brSfz,
  //   eddate: formState.value['dateRange']?.[1],
  //   ghys: formState.value.ghys,
  //   ghzt: formState.value.ghzt,
  //   ksdm: formState.value.ksdm.length ? formState.value.ksdm : [],
  //   pyjm: formState.value.pyjm,
  //   stdate: formState.value['dateRange']?.[0],
  //   zdmc: formState.value.zdmc
  // })
  // if (code !== 0) return
  // tableData.value = data
  // loading.value = false
}
onMounted(() => {
  queryList()
})
// const onExport = () => {
//   const title = `库存查询`
//   const head = columns.map((item) => item.title)
//   const data = tableData.value.map((item) => {
//     return columns.map((col) => {
//       return item[col.dataIndex]
//     })
//   })
//   downloadCSV(title, head, data).then(() => {
//     message.success('导出成功')
//   })
// }
</script>
<style lang="less" scoped>
.ant-picker {
  width: 100%;
}
</style>
